import { Segmented } from "antd";
import { useState } from "react";
import Outline from "../Outline";
import Material from "../Material";
import Source from "../Source";
import "./index.scss";

export function MaterialWrapper() {
	const [key, setKey] = useState<string>("物料");

	return (
		<div className="columnContainer" style={{height:"100%"}}>
			<Segmented
				value={key}
				onChange={setKey}
				block
				options={["物料", "大纲", "源码"]}
			/>
			<div className="material-wrapper">
				{key === "物料" && <Material />}
				{key === "大纲" && <Outline />}
				{key === "源码" && <Source />}
			</div>
		</div>
	);
}
